<template>
  <div>
    <a-button type="primary" @click="handleSubmit()" v-show="submitShow">
      <icon-font type="icon-wf-tijiao" />
      提交
    </a-button>
    <a-divider type="vertical" v-show="delegateShow" />
    <a-button
      type="primary"
      @click="handleDelegate()"
      v-show="delegateShow">
      <icon-font type="icon-wf-weituo" />
      委托
    </a-button>
    <a-divider type="vertical" v-show="turnToDoShow" />
    <a-button
      type="primary"
      @click="handleTurnToDo()"
      v-show="turnToDoShow">
      <icon-font type="icon-wf-zhuanban" />
      转办
    </a-button>
    <a-divider type="vertical" v-show="rejectShow" />
    <a-button
      type="primary"
      @click="handleReject()"
      v-show="rejectShow">
      <icon-font type="icon-wf-bohui1" />
      驳回
    </a-button>
    <a-divider type="vertical" v-show="cancelShow" />
    <a-button type="primary" @click="handleCancel()" v-show="cancelShow">
      <icon-font type="icon-wf-zuofei" />
      作废
    </a-button>
    <a-divider type="vertical" v-show="withdrawShow" />
    <a-button
      type="primary"
      @click="handleWithdraw()"
      v-show="withdrawShow">
      <icon-font type="icon-wf-chehui" />
      撤回
    </a-button>

    <!--处理流程任务-->
    <submit-task :task-node="taskNode" :submit-type="submitType" ref="submitTask" @submitOk="submitOk" />
    <delegate-task :task-node="taskNode" :submit-type="submitType" ref="delegateTask" @submitOk="submitOk" />
    <cancel-task :task-node="taskNode" :submit-type="submitType" ref="cancelTask" @submitOk="submitOk" />
    <turn-to-do-task :task-node="taskNode" :submit-type="submitType" ref="turnToDoTask" @submitOk="submitOk" />
    <withdraw-task :task-node="taskNode" :submit-type="submitType" ref="withdrawTask" @submitOk="submitOk" />
  </div>
</template>
<script>

import request from '@/utils/request'
import { mapGetters } from 'vuex'
import SubmitTask from '@/components/flowable/task/submitTask.vue'
import DelegateTask from '@/components/flowable/task/delegateTask.vue'
import TurnToDoTask from '@/components/flowable/task/turnToDoTask.vue'
import CancelTask from '@/components/flowable/task/cancelTask.vue'
import { getWorkflow } from '@/api/workflow/workflow'
import WithdrawTask from '@/components/flowable/task/withdrawTask.vue'

export default {
  name: 'TaskButton',
  components: { WithdrawTask, CancelTask, TurnToDoTask, DelegateTask, SubmitTask },
  props: {
    bizId: {
      type: String,
      default: ''
    },
    flowData: {
      type: Object,
      default: undefined
    }
  },
  data () {
    return {
      // 提交按钮
      submitShow: false,
      // 驳回按钮
      rejectShow: false,
      // 取消按钮
      cancelShow: false,
      // 委托按钮
      delegateShow: false,
      // 转办按钮
      turnToDoShow: false,
      // 撤回
      withdrawShow: false,
      // 提交类型
      submitType: undefined,
      // 任务数据
      taskData: {},
      // 任务节点
      taskNode: {}
    }
  },
  watch: {
    bizId: function (val) {
      this.getWorkflow(val)
      if (!!val && this.flowData.show) {
        this.initWorkflow(val)
      }
      console.log(!!val, this.flowData.show)
    }
  },
  computed: {
    ...mapGetters(['userId'])
  },
  methods: {
    // 提交
    handleSubmit () {
      this.submitType = 'S'
      this.getTaskNode(this.submitType)
      this.$refs.submitTask.show()
    },
    // 驳回
    handleReject () {
      this.submitType = 'R'
      this.getTaskNode(this.submitType)
      this.$refs.submitTask.show()
    },
    // 取消
    handleCancel () {
      this.submitType = 'C'
      this.getTaskNode(this.submitType)
      this.$refs.cancelTask.show()
    },
    // 委托
    handleDelegate () {
      this.submitType = 'D'
      this.getTaskNode(this.submitType)
      this.$refs.delegateTask.show()
    },
    // 转办
    handleTurnToDo () {
      this.submitType = 'T'
      this.getTaskNode(this.submitType)
      this.$refs.turnToDoTask.show()
    },
    // 撤回
    handleWithdraw () {
      this.submitType = 'W'
      this.$refs.withdrawTask.show()
    },
    // 获取流程数据
    getWorkflow (bizId) {
      getWorkflow(bizId).then(res => {
        const data = res.data
        if (data) {
          this.withdrawShow = data.workflowStatus === 'in_process' && this.userId === data.createUserId
        }
      })
    },
    // 初始化流程
    initWorkflow (bizId) {
      const data = {
        bizId: bizId,
        bizUrl: this.flowData.route,
        userId: this.userId
      }
      request({
        url: `${this.flowData.service}/${this.flowData.module}/initWorkflow`,
        method: 'post',
        data: data
      }).then(res => {
        this.taskData = res.data
        this.submitShow = res.data.handleTypes.indexOf('S') !== -1
        this.rejectShow = res.data.handleTypes.indexOf('R') !== -1
        this.delegateShow = res.data.handleTypes.indexOf('D') !== -1
        this.cancelShow = res.data.handleTypes.indexOf('C') !== -1
        this.turnToDoShow = res.data.handleTypes.indexOf('T') !== -1
        this.withdrawShow = false
      })
    },
    // 获取审批节点
    getTaskNode (type) {
      // 初始化下一任务节点
      const params = {
        taskId: this.taskData.taskId,
        bizId: this.bizId,
        userId: this.userId,
        type: type
      }
      request({
        url: `${this.flowData.service}/${this.flowData.module}/initNextNode`,
        method: 'get',
        params: params
      }).then(res => {
        if (res.code === 200) {
          this.taskNode = res.data
        }
      })
    },
    // 提交任务
    submitOk (data) {
      if (this.submitType === 'W') {
        request({
          url: `${this.flowData.service}/${this.flowData.module}/withdrawTask`,
          method: 'post',
          data: {
            'bizId': this.bizId,
            'userId': this.userId,
            'comment': data.comment
          }
        }).then(res => {
          if (res.code === 200) {
            this.$message.success(
              '撤回成功',
              3
            )
            this.$multiTab.closeCurrentPage()
          }
        })
      } else {
        request({
          url: `${this.flowData.service}/${this.flowData.module}/submitTask`,
          method: 'post',
          data: data
        }).then(res => {
          if (res.code === 200) {
            this.$message.success(
              '提交成功',
              3
            )
            this.$multiTab.closeCurrentPage()
            this.$refs.submitTask.handleCancel()
          }
        })
      }
    }
  }
}
</script>
